<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">

    <!--BootStrap设计的页面支持响应式的 -->

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 引入主题  -->

    <link href="bootstrap-3.3.7/css/bootstrap-theme.min.css" rel="stylesheet" />

    <!-- 引入bootstrap的css -->

    <link href="bootstrap-3.3.7/css/bootstrap.min.css" rel="stylesheet" />

    <!-- 引入jquery的js  因为bootstrap使用到jquery的js -->

    <script src="js/jquery-3.3.1.min.js"></script>
    <!--    进度条-->
    <link rel="stylesheet" href="blue/pace-theme-corner-indicator.css">
    <script src="js/pace.js"></script>

    <!-- 引入bootsrap的js -->

    <script src="bootstrap-3.3.7/js/bootstrap.min.js"></script>
    <!--	地址的js文件引入-->
    <script src="js/distpicker.data.js"></script>
    <script src="js/distpicker.js"></script>
    <script src="js/main.js"></script>
    <script>
        $("#tijiao").click(function(){
            var province = $("#eprovinceName").find("option:selected").text();
            var city = $("#ecityName").find("option:selected").text();
            var district = $("#edistrictName").find("option:selected").text();
            console.log(province);
            console.log(city);
            console.log(district);
        });
    </script>
    <title>个人信息管理</title>
    <style>
        .xiaotaoobject {
            height: 140px;
            width: 140px;
            object-fit: contain;
        }
        .myitem{
            margin-top: 20px;
        }
        .myinput{
            width: 50%;
            height: 50px;
            margin-top: 20px;
        }
        .s1{
            margin-bottom: 2px;
        } body{
              background-image: url("images/背景.jpg");
          }
    </style>
</head>
<body >
<div class="container">


    <div class="row clearfix">
        <div class="col-md-6 column">
            <div class="row clearfix">
                <div class="col-md-6 column">
                    <img alt="小淘图标" class="xiaotaoobject "  src="images/order_a.jpg"  />
                </div>
                <div class="col-md-6 column">
                    <div class="page-header">
                        <h1>
                            小淘商城<p><small>2020最新潮流</small></p>
                        </h1>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-6 column">
            <ul class="breadcrumb">
                <li>
                    <a href="#">首页</a>
                </li>
                <li class="active">
                    个人信息管理
                </li>
            </ul>
            <blockquote>
                <p>
                    每一份货物都会用心送达，请您放心！💕
                </p> <small> <cite>小淘寄语</cite></small>
            </blockquote>
        </div>
    </div>

    <!--	后面加的个人资料-->
    <div class="row clearfix thumbnail">
        <div class="col-md-12 column">
            <h3 class="text-primary">个人资料修改</h3>
            <form role="form">
                <div class="form-group">
                    <label >用户名</label><input  class="form-control"  />
                </div>
                <div class="form-group">
                    <label >新店名</label><input  class="form-control"  />
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">新密码</label><input type="password" class="form-control" id="exampleInputPassword1" />
                </div>
                <div class="form-group">
                    <label for="exampleInputFile">新头像</label><input type="file" id="exampleInputFile" />

                </div>
                <button type="submit" class="btn btn-default">提交💕</button>
            </form>
        </div>
    </div>
    <div class="row clearfix thumbnail">
        <p>填写寄件人姓名：<input  type="text"></p>
        <p>填写联系电话：<input type="text"></p>
        <p>💕填写地址信息:</p>

        <div data-toggle="distpicker">
            <select id="eprovinceName" data-province="广东省" name="provinceName"></select>
            <select id="ecityName" data-city="广州市" name="cityName"></select>
            <select id="edistrictName" data-district="番禺区" name="districtName"></select>
        </div>

        <p>填写详细地址：<input class="myinput" type="text"></p>
        <div class="col-md-12 column">
            <button type="button" class="btn btn-default">添加地址✌</button>
        </div>
    </div>
    <div class="row clearfix thumbnail">
        <div class="col-md-12 column">
            <span class="label label-success"></span> <span class="label label-success">默认地址</span>
            <div class="row clearfix">
                <div class="col-md-6 column">
                    <div class="page-header">
                        <small>
                            <p>寄件人姓名：<a>华工吴亦凡</a></p>
                            <p>寄件人电话：<a>12345678945</a></p>
                            详细地址：
                            <a>广东省</a><a>广州市</a><a>番禺区</a>
                            <p><a>华南理工大学大学城校区生活区第一饭堂</a></p>
                        </small>
                    </div>
                </div>
                <div class="col-md-6 column ">
                    <button type="button" class="btn btn-default s1">设置为默认地址</button>
                    <button type="button" class="btn btn-default s1">删除地址</button>
                </div>
            </div>
        </div>
    </div>
    <div class="row clearfix thumbnail">
        <div class="col-md-12 column">
            <span class="label label-success"></span> <span class="label label-default">常用地址</span>
            <div class="row clearfix">
                <div class="col-md-6 column">
                    <div class="page-header">
                        <small>
                            <p>寄件人姓名：<a>华工吴亦凡</a></p>
                            <p>寄件人电话：<a>12345678945</a></p>
                            详细地址：
                            <a>广东省</a><a>广州市</a><a>番禺区</a>
                            <p><a>华南理工大学大学城校区生活区第二饭堂</a></p>
                        </small>
                    </div>
                </div>
                <div class="col-md-6 column s1">
                    <button type="button" class="btn btn-default">设置为默认地址</button>
                    <button type="button" class="btn btn-default">删除地址</button>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>